<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<script>
			/* 
            定时器的本质，就是在指定时间后将函数添加到消息队列中
        */
			// console.time()
			// setTimeout(function(){
			//     console.timeEnd()
			//     console.log("定时器执行了~")
			// }, 3000)

			// 使程序卡6s
			// const begin = Date.now()
			// while (Date.now() - begin < 6000) {}



			/* 
            setInterval() 每间隔一段时间就将函数添加到消息队列中
                但是如果函数执行的速度比较慢，它是无法确保每次执行的间隔都是一样的
			*/
			// console.time("间隔")
			// setInterval(function(){
			//     console.timeEnd("间隔")

			//     // console.log("定时器执行了~~")
			//     alert("定时器执行~")

			//     console.time("间隔")
			// }, 3000)



			/* 
				希望可以确保函数每次执行都有相同间隔
			*/
			// console.time("间隔")
			// setTimeout(function fn() {
			//     console.timeEnd("间隔")
			//     alert("哈哈")

			//     console.time("间隔")
			//     // 在setTimeout的回调函数的最后，在调用一个setTimeout
			//     setTimeout(fn, 3000)
			// }, 3000)


			/* 下面先打印哪一个log
			第二个log是全局的，执行script时是放在栈底部的全局中(看166调用栈图示)，
			而setTimeout是在0s时放到消息队列中，然会再入栈。
			所以先打印2222，后打印111
			 */
			setTimeout(() => {
				console.log(11111)
			}, 0)

			console.log(222222)
		</script>
	</body>
</html>